<script setup lang="ts">
import { ref } from 'vue'
import { counterProps } from './types'

defineProps(counterProps)

const countNum = ref<number>(0)

const addCount = () => countNum.value++
</script>

<template>
  <div class="wma-counter">
    <h1>计数器【{{ msg }}】</h1>
    <span style="margin-right: 18px">
      当前数目：<strong>{{ countNum }}</strong>
    </span>
    <a-button @click="addCount">计数</a-button>
  </div>
</template>

<style lang="scss" scoped>
.wma-counter {
  color: red;
}
</style>
